<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>班次信息</title>
<link rel="stylesheet" type="text/css"
	href="../ext/resources/css/ext-all.css"></link>
	
	<link rel="stylesheet" type="text/css" href="../ext/resources/css/xtheme-slate.css"></link>
<script src="../ext/adapter/ext/ext-base.js"></script>
<script src="../ext/ext-all.js"></script>
<script src="../ext/src/locale/ext-lang-zh_CN.js"></script>
<script src="../ext/base/PagingMemoryProxy.js"></script>
<script type="text/javascript">
	Ext.onReady(function() {
		// ajax回调函数处理系统退出   
		Ext.Ajax.on('requestcomplete',checkUserSessionStatus, this);      
		function checkUserSessionStatus(conn,response,options){      
		    if(response.getResponseHeader('sessionstatus')){      
		        parent.location.href='/xdj/index.jsp';   
		    }      
		}  

		var thenode;
	//	Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';
		var treeloader = new Ext.tree.TreeLoader({ // dataUrl : 'tree.jsp'//这里可以不需要指定URL，在加载前事件响应里面设置 	
		});
		var rootnode = new Ext.tree.AsyncTreeNode({ // 异步加载根节点 
			id : '2',
			text : '大坝电厂',
			cls : 'folder'
		});
		var thenode = rootnode;
		var tree = new Ext.tree.TreePanel({
			el : 'tree',// 将树形添加到一个指定的div中,非常重要！  
			border : false,
			region : 'west',
			//title : '功能菜单',  
			lines : true, //线段
			width : 300,
			height : 900,
			split : true,
			//autoHeight : true,  
			frame : true,// 美化界面    
			enableDD : false,// 是否支持拖拽效果  
			containerScroll : true,// 是否支持滚动条  
			rootVisible : true, // 是否隐藏根节点,很多情况下，我们选择隐藏根节点增加美观性  
			animate : true, // 动画效果  
			root : rootnode,
			loader : treeloader,
			listeners : {
				'beforeload' : function(node) {
					treeloader.dataUrl = "depart_load?parentID=parentID_"
							+ node.id + "_EQ";
				},
				'click' : function(node) {
					thenode = node;
					 Ext.apply(store.baseParams , {departmentID:thenode.id});//分页加参数
					store.load({
						params : {
							departmentID : thenode.id,
							start:0,
							limit:10
						}
					});
				}
			}

		// 树加载  s
		});
		tree.render(); // 渲染树形 

		//表格
	//	var sm = new Ext.grid.CheckboxSelectionModel();//列的复选框
		var cm = new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer(), //自动增加序列号
	//	sm, //加到每列的前边
		 //True表示为可在该列上进行排列
		{
			header : '值班名称',
			dataIndex : 'name'
		}, {
			header : '起始时间',
			dataIndex : 'startTime',
			width : 250,
			xtype : 'datecolumn',
			format : 'H:i:s'
		}, {
			header : '终止时间',
			dataIndex : 'endTime',
			width : 250,
			xtype : 'datecolumn',
			format : 'H:i:s'
		},{
			header : '备注',
			dataIndex : 'remarks'
		},{
			header:'id',
			dataIndex:"id",
			hidden:true
		}
		]);//定义相应的列模型

		var store = new Ext.data.JsonStore({
			url : 'class_load',
			 root: 'result',
			// idProperty:'id',
			totalProperty:'totalProperty',
			fields : [ {
				name : 'name'
			}, {
				name : 'startTime',
				type : Ext.data.Types.DATE,
				dateFormat : 'H:i:s'
			}, {
				name : 'endTime',
				type : Ext.data.Types.DATE,
				dateFormat : 'H:i:s'
			} , {
				name : 'remarks'
			}, {
				name : 'id'
			}]
		});//存储前两项的定义的东西，将其连接起来

		var panel = new Ext.grid.GridPanel({
			region:'center',
			border:false,
			cm : cm,
		//	sm : sm,
			store : store,
			height :  document.body.clientHeight, //设置表格的高度 true为自动获取表格的大小
			//renderTo : 'grid', //渲染容器
			enableColumnMove : false,//不可以使表格列移动
			enableColumnResize : false, //不可以改变列的宽度
			stripeRows : false, //True表示为显示行的分隔符
			loadMask : true, //会有一个Ext.LoadMask的遮罩效果
			trackMouseOver : true, //True表示为鼠标移动时高亮显示（默认为true）。
			enableDragDrop : true,
			viewConfig : {
				forceFit : true
			//让没列自动填满表格，根据你设置的宽度按比例分配
			},
			tbar : [ {
				text : "删除",disabled:true,id:'cDeleteBox',
				icon:'../image/public/user_delete.png',
				handler:function() {
					Ext.MessageBox.confirm("提示","您确定要删除这些信息吗?", function(button,text){   
						if(button=='yes'){
				    		var record=panel.getSelectionModel().getSelected();
				    		if(record==null){
								alert("请您选择要删除的班次");
								Ext.getBody().unmask();
							}else{
								Ext.Ajax.request({
									url:'class_delete',
									success:function(response){
										var result = Ext.util.JSON.decode(response.responseText);
										if(result.success==true){
											store.load({
												params:{
													departmentID:thenode.id
												}
											});
										}else{
											Ext.Msg.alert("提示","操作失败，请重试。") ;
										}
									},
									params:{classID:record.get("id")}
								});
							}
							
						}
						}); 

		    	}
			}, {
				text : "修改",disabled:true,id:'cModifyBox',
				icon:'../image/public/user_edit.png',
				handler:function() {
					Ext.MessageBox.confirm("提示","您确定要修改这些信息吗?", function(button,text){   
						if(button=='yes'){
							Ext.getBody().mask();
							var record=panel.getSelectionModel().getSelected();
							if(record==null){
								alert("请您选择要修改的班次");
								Ext.getBody().unmask();
							}else{
								showWindown("class_update");
				        		classform.getForm().setValues({
				        			"claName" : record.get("name"),
				        			"startTime" : record.get("startTime"),
				        			"endTime": record.get("endTime") ,
				        			"remarks": record.get("remarks"), 
				        			"classID": record.get("id")
				        		});
							}
			        		
						}
						}); 	
				}
			}, {
				text : '增加',disabled:true,id:'cAddBox',
				icon:'../image/public/user_add.gif',
				handler:function(){
					Ext.getBody().mask();
		        	showWindown("class_save");
		        }
			} ],
			bbar : new Ext.PagingToolbar({
				pageSize : 10, //每页显示几条
				store : store,
				beforePageText:"当前第",   
	            afterPageText:"页，共{0}页",   
	            lastText:"尾页",   
	            nextText :"下一页",   
	            prevText :"上一页",   
	            firstText :"首页",                           
		        displayInfo:true, 
		        displayMsg:'显示第{0}条数据到{1}条数据,一共有{2}条', 
		        emptyMsg:'没有记录'
			})
		});
		store.load({params:{start:0,limit:10}});//加载数据  注意，一旦使用了分页条， store.load();就必须在构造表格之后进行执行，否则将不起作用，并且将分页条和数据源关联，从而实现与表格共享数据模型

		function showWindown(urlString) {
			//右面表单信息
				classform = new Ext.form.FormPanel({
				frame : true,
				height : 180,
				buttonAlign : 'right',
				labelAlign : 'center',
				layout : 'form',
				items : [ {
							fieldLabel : '值班名称',
							xtype : 'textfield',
							allowBlank : false,
							blankText : '名称不能为空',
							name : 'claName'
					}, {
							columnWidth : .25,
							fieldLabel : '起始时间',
							format : 'H:i:s', //加上以后才显示在label中
							xtype : 'timefield',
							allowBlank:false,
							blankText:'时间不能为空',
							name : 'startTime'
					}, {
							fieldLabel : '终止时间',
							xtype : 'timefield',
							format : 'H:i:s',
							allowBlank : false,
							blankText : '时间不能为空',
							name : 'endTime'
					},  {
							xtype:'hidden',
							name:'departmentID',
							value:thenode.id
					},  {
						xtype:'hidden',
						name:'classID'
					},{
						fieldLabel:'备注',
						xtype:'textarea',
						width:200,
						height:50,
						grow:true, //可自动增长
						preventScrollbars:true,  //不显示那个下拉条 必须与grow一起用
						name:'remarks'
				}],
				buttons : [ {
					text : "确认",
					handler:function(){
						if ( classform.getForm().isValid() ){
							classform.form.submit({   
				        	waitMsg : '正在提交数据....',   
				            url:urlString,   
				            method:'post', 
					            success:function(classform,action){  
					            	var result = Ext.util.JSON.decode(action.response.responseText);
					            	if(result.success==true) {
					            		if(urlString=="class_save"){
					            			win.close();
					            			Ext.getBody().unmask();
					            			store.load({
												params:{
													departmentID:thenode.id,
													start:0,
													limit:10
												}
											});
					            			
					            		}else if(urlString=="class_update"){
					            			win.close() ;
					            			Ext.getBody().unmask();
					            			store.load({
												params:{
													departmentID:thenode.id
												}
											});
					            			
					            		}
					            		
					            	}else{
					            		Ext.Msg.alert("提示","操作失败，请重试。") ;
					            	}
					            }
					          }); 
					       }
					}
				}, {
					text: "取消",
			        handler:function(){ 
			           	win.close() ;
			           	Ext.getBody().unmask();
			        }
				} ]
			});
			var win=new Ext.Window({
				//title:'登录',
				 width:400,
				 height:210,
				 items:[classform],
				 xtype:'form',
				 listeners:{"beforedestroy":function(obj)
	                 { 
					 Ext.getBody().unmask();  
	                    // obj.show(); return false; 
	                  }
				}  
			});
			win.show();
		}

		new Ext.Viewport({
			layout : 'border', // 使用border布局  
			border : false,
			items : [ {
				region : 'west',
				border : false,
				width : 200,
				items : [ tree ]
			},  panel  ],
			listeners:{
				'beforerender' : function(cmp) {
					// set role
					var store=new Ext.data.JsonStore({
						url: '../system/role_loadFunc?funcCode=ControlClassDuty',
						autoLoad : true,
						fields: ["functioncode"]
					});
					store.load({
					    callback: function(records, options, success){
					    	var i=0;
					    	for(; i<records.length; i++) {
					    		var id = records[i].get("functioncode");
					    		//alert('d'+Ext.getCmp('56').text);
					    		if(Ext.getCmp(id)!=null) {
					    			Ext.getCmp(id).setDisabled(false);
					    		}
					        }
					    },
					    scope: store
					});
				}
			}
		});

	});
</script>
</head>
<body>
	<div id="tree"></div>
	<div id="grid"></div>
</body>
</html>